<template>
  <el-dialog
    :close-on-click-modal="false"
    :visible.sync="visible"
    class="JADP-dialog JADP-dialog_center"
    lock-scroll
    append-to-body
    width="70%"
    title="新增课程"
    @close="$emit('refresh', true)"
  >
    <el-button
      style="margin: 10px"
      icon="el-icon-plus"
      type="primary"
      @click="addCourse"
      v-if="!area"
      >添加课程</el-button
    >
    <JADP-table v-loading="listLoading" :data="list">
      <el-table-column prop="crmname" label="课程名称" align="left" />
      <el-table-column label="课程分类" prop="crmclassification" algin="left">
        <template slot-scope="scope">
          <!-- {{ getDict("kjfl", scope.row.crmclassification) }} -->
          {{ scope.row.crmclassification }}
        </template>
      </el-table-column>
      <!-- <el-table-column prop="crmstarttime" label="开始时间" align="left" />
      <el-table-column prop="crmendtime" label="结束时间" align="left" /> -->
      <el-table-column prop="hours" label="学时" align="left" />
      <el-table-column prop="teacher" label="讲师" align="left">
        <template #default="{ row }">
          <ShowAllText :row="row.teacher" :num="20" />
        </template>
      </el-table-column>
      <el-table-column label="操作" fixed="right" width="100" v-if="!area">
        <template slot-scope="scope">
          <el-button
            type="text"
            class="JADP-table-delBtn"
            @click="handleDel(scope.row.id)"
            >删除
          </el-button>
        </template>
      </el-table-column>
    </JADP-table>
    <pagination
      :total="total"
      :page.sync="listQuery.currentPage"
      :limit.sync="listQuery.pageSize"
      :page-sizes="[5, 10, 20, 50]"
      @pagination="initData"
    />
    <span slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" @click="visible = false">确 定</el-button>
    </span>
    <TableForm ref="TableForm" @initData="initData" :ParentList="list" />
  </el-dialog>
</template>
<script>
import request from "@/utils/request";
import TableForm from "./tableForm.vue";
export default {
  name: "",
  components: { TableForm },
  data() {
    return {
      list: [],
      total: 0,
      listQuery: {
        currentPage: 1,
        pageSize: 10,
        sort: "desc",
        sidx: "",
      },
      listLoading: false,
      formVisible: false,
      visible: false,
      clazzid: "",
      area: false,
    };
  },
  // created() {
  //   this.initData();
  // },
  methods: {
    initData() {
      this.visible = true;
      this.listLoading = true;
      let _query = {
        ...this.listQuery,
        clazzid: this.clazzid,
        organizeId:this.$store.getters.organizeId
      };
      let query = {};
      for (let key in _query) {
        if (Array.isArray(_query[key])) {
          query[key] = _query[key].join();
        } else {
          query[key] = _query[key];
        }
      }
      request({
        url: `/api/xy_ks_class_sourse/Xy_ks_class_sourse`,
        method: "get",
        data: query,
      }).then((res) => {
        console.log(res, "res");
        this.list = res.data.list;
        this.total = res.data.pagination.total;
        this.listLoading = false;
      });
    },
    addCourse() {
      this.$refs.TableForm.visible = true;
      this.$refs.TableForm.id = this.clazzid;
      this.$refs.TableForm.echo();
    },
    handleDel(id) {
      this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
        type: "warning",
      })
        .then(() => {
          request({
            url: `/api/xy_ks_class_sourse/Xy_ks_class_sourse/${id}`,
            method: "DELETE",
          }).then((res) => {
            this.$message.success(res.msg);
            this.initData();
          });
        })
        .catch(() => {});
    },
  },
};
</script>
<style scoped lang="scss"></style>
